<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="stylesheet" type="text/css" href="${ctx}/static/plug/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/static/plug/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/static/plug/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/static/plug/h-ui.admin/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="${ctx}/static/plug/h-ui.admin/css/style.css" />
<style type="text/css">
.Hui-iconfont{
	text-decoration: underline;
}
.col-xs-3{
	width: 250px;
}
.col-xs-2{
	width: 6%;
}
.col-xs-4{
	width: 250px;
}
.row{
	margin-left: 0;
}

.header{
	background-color: #286abf;
	width: 100%;
	height:8%;
	position: relative;
}
.header>p{
	text-align: center;
	font-size: 24px;
	font-weight: 700;
	color: white;	
	line-height: 2.5;
}

.datetime{
	font-size: 24px;
	font-weight: 500;
	color: white;
	position: absolute;
	right: 0px;
	top: 0px;
	margin: 15px 30px;
}
.datetime span{
	margin-left: 10px;
}
.tailer{
	background-color: #286abf;
	width: 100%;
	height: 8%;
	position: fixed;
	bottom: 0;
	z-index: 999999;
}
.returns{
	float: right;
	margin-right: 20px;
	margin-left: 100px;
	height: 75%;
	background-color: white;
	color: #999;
	width: 150px;
	border-radius: 10px;
	margin-top: 10px;
	background-color: white;
	cursor: pointer;
	line-height: 2.5;
}
.returns>p{
	text-align: center;
	font-size: 20px;
	color: #666;
}
</style>
<title>订单查询</title>
</head>
<body>
	<c:if test="${bmsUser.type == 3 }">
					<div class="header">
						<p>订单查询</p>
						<div class="datetime">
							<span class="times"></span> <span>${bmsUser.entNo}，你好</span>
							<input type="hidden" value="${bmsUser.scenicSpotId}" id="scenicSpotId">
						</div>
					</div>
				</c:if>



	<div class="page-container">
		<div> 
			<div>
				<div class="row cl">
						<input readonly="readonly" type="text" onfocus="WdatePicker({ maxDate:'#F{$dp.$D(\'endTime\')||\'%y-%M-%d\'}',dateFmt:'yyyy-MM-dd HH:mm:ss' })" id="startTime" class="input-text Wdate" style="width:180px;">
						-<input readonly="readonly" type="text" onfocus="WdatePicker({ minDate:'#F{$dp.$D(\'startTime\')}',maxDate:'%y-%M-%d',dateFmt:'yyyy-MM-dd HH:mm:ss' })" id="endTime" class="input-text Wdate" style="width:180px;">
					<span class="select-box inline">
					<select name="" class="select" id="status">
						<option value="">请选择状态</option>
						<option value="0">待支付</option>
						<option value="1">支付成功</option>
					</select>
				</span>
				<input type="text" id="orderNo" placeholder="商家订单号" style="width:250px" class="input-text">
				<input type="text" id="transactionId" placeholder="微信流水号" style="width:250px" class="input-text">
				<button class="btn btn-success" type="submit" onclick="reloadData()"><i class="Hui-iconfont">&#xe665;</i> 搜索</button>
				<button class="btn btn-success" type="submit" onclick="newData()"><i class="Hui-iconfont">&#xe665;</i> 重置</button>
				
				</div>
			</div>
		</div>
		<div class="mt-20">
			<table id="dataTable" class="table table-border table-bordered table-hover table-bg table-sort">
				<thead>
					<tr class="text-c">
						<th width="5%">票类型</th>
						<th width="10%">购票渠道</th>
						<th width="6%">购票张数</th>
						<th width="6%">取票人</th>
						<th width="18%">商家订单号</th>
						<th width="16%">微信流水号</th>
						<th width="10%">总额</th>
						<th width="11%">购买时间</th>
						<th width="5%">状态</th>
						<th width="6%">操作</th>
					</tr>
				</thead>
				<tbody>
				</tbody>
			</table>
		</div>
	</div>
	
	<c:if test="${bmsUser.type == 3 }">
				<div class="tailer">
					
					<div class="returns">
						<p id="return">综合售票大厅</p>
					</div>
					
					<div class="returns">
							<p id="refund">退票</p>
						</div>
						
						<div class="returns">
							<p id="collection">取票</p>
						</div>
						
						<div class="returns">
							<p id="sell">售票</p>
						</div>
					
				</div>
			</c:if>
	<!--请在下方写此页面业务相关的脚本-->
	<script type="text/javascript" src="${ctx}/static/plug/My97DatePicker/4.8/WdatePicker.js"></script>
	<script type="text/javascript" src="${ctx}/static/plug/datatables/1.10.0/jquery.dataTables.min.js"></script>
	<script type="text/javascript" src="${ctx}/static/plug/laypage/1.2/laypage.js"></script>
	<script type="text/javascript">
	
	function newData() {
		console.log("111")
		$("#status > option").attr("selected",false);
		$("#status > option").eq(0).attr("selected",true);
		$("#orderNo").val("");
		$("#transactionId").val("");
		$("#startTime").val("");
		$("#endTime").val("");
	}
		var dataTable;
		$(function() {
			getNowFormatDate();
			function getNowFormatDate() {
			    var date = new Date();
			    var seperator1 = "-";
			    var seperator2 = ":";
			    var month = date.getMonth() + 1;
			    var strDate = date.getDate();
			    var secondStr = date.getSeconds();
				var minuteStr = date.getMinutes();
				var hourStr = date.getHours();
			    if (month >= 1 && month <= 9) {
			        month = "0" + month;
			    }
			    if (strDate >= 0 && strDate <= 9) {
			        strDate = "0" + strDate;
			    }
			    if (secondStr >= 0 && secondStr <= 9) {
					secondStr = "0" + secondStr;
				}
				if (minuteStr >= 0 && minuteStr <= 9) {
					minuteStr = "0" + minuteStr;
				}
				if (hourStr >= 0 && hourStr <= 9) {
					hourStr = "0" + hourStr;
				}
				
				var currentdate = date.getFullYear() + seperator1 + month + seperator1
				+ strDate + " " + hourStr + seperator2 + minuteStr
				+ seperator2 + secondStr;
			    $(".times").text(currentdate);
			    setTimeout(getNowFormatDate, 1000);
			}
			$("#sell").click(function() {
				var scenicSpotId = $("#scenicSpotId").val();
				window.location.href="${ctx}/selling/toVoteTicket?scenicSpotId=" + scenicSpotId;
			});
			
			$("#collection").click(function() {
				window.location.href="${ctx}/takeOrRetreat/toCheckCodePick?modeType=" + 1;
			});
			$("#refund").click(function() {
				window.location.href="${ctx}/takeOrRetreat/toCheckCodePick?modeType="  + 2;
			});
			$("#return").click(function() {
				window.location.href="${ctx}/selling/index";
			});

			
			
			
			dataTable = $("#dataTable").DataTable($.extend(true, {}, TABLE_CONSTANT.DATA_TABLES.DEFAULT_OPTION, {
				"ajax" : function(data, callback, settings) {
					var param = getQueryParam(data);
					$.ajax({
						type : "POST",
						url : "${ctx}/order/list",
						cache : false, //禁用缓存
						data : param, //传入已封装的参数
						dataType : "json",
						success : function(result) {
							console.log(result)
							callback(result);
						},
						error : function(XMLHttpRequest, textStatus, errorThrown) {
							alert("查询失败");
						}
					});
				},
				
				"columns" : [{
					"data" : "ticketName"
				},{
					"data" : "purchaseType"
				},{
					"data" : "ticketNums"
				},{
					"data" : "receiverName"
				},{
					"data" : "orderNo"
				},{
					"data" : "transactionId"
				},{
					"data" : null
				},{
					"data" : "payTimeStr"
				},{
					"data" : "statuStr"
				},{
					"data" : null
				}],
				"columnDefs" : [ {
					targets : 6,
					render : function(a, b, c, d) {
						var html = "￥"+(c.totalFee/100).toFixed(2) + "元";
						return html;
					}
				} ,{
					targets : 9,
					render : function(a, b, c, d) {
						var html = genOperatirHtml(c.status, c.id);
						return html;
					}
				} ]
			}));
		});

		
		
		
		
		function genStatusHtml(status) {
			
		}
		

		function genOperatirHtml(status, id) {
			var html = "";
			
			html += "<a title=\"查看详情\" href=\"javascript:;\" onclick=\"addOrUpdate('查看详情','${ctx}/order/details?orderId="
				+ id + "','','473')\" class=\"ml-5\" style=\"text-decoration:none\">";
			html += "<i class=\"Hui-iconfont\">查看详情</i></a> ";
			
			return html;
		}
		

		function getQueryParam(data) {
			var param = {};
			var startTime = $("#startTime").val();
			var endTime = $("#endTime").val();
			var orderNo = $("#orderNo").val();
			var status = $("#status").val();
			var transactionId = $("#transactionId").val();
			if (startTime) {
				param.startTime = startTime;
			}
			if (endTime) {
				param.endTime = endTime;
			}
			if (orderNo) {
				param.orderNo = orderNo;
			}
			if (status) {
				param.status = status;
			}
			if (transactionId) {
				param.transactionId = transactionId;
			}

			//自定义的查询条件 后面加
			param.draw = data.draw;
			param.startIndex = data.start;
			param.pageSize = data.length;
			return param;
		}

		function reloadData(resetPage) {
			dataTable.ajax.reload(null,resetPage);
		}
		
		function addOrUpdate(title,url,width,height) {
			layer_show(title,url,width,height);
		}
		
		
		function changeStatus(obj, status, id) {
			var title = "";
			if (0 === status) {
				title = "确认要停用该票类型吗？";
			} else if (1 == status) {
				title = "确认要激活该票类型吗？";
			} else if (-1 == status) {
				title = "确认要删除该票吗？";
			}

			var param = {};
			param.ticketInfoId = id;
			param.status = status;

			layer.confirm(title, {}, function(index) {
				$.ajax({
					type : 'POST',
					url : '${ctx}/ticketInfo/changeStatus',
					data : param,
					dataType : 'json',
					success : function(data) {
						layer.close(index);
						if (data.result) {
							reloadData(false);
						} else {
							layer.msg(data.msg);
						}
					},
					error : function(data) {
						layer.close(index);
						layer.msg(data.msg);
					},
				});
			}, function() {
			});
		}
		
		function returns() {
			window.location.href="${ctx}/selling/index";
		}
	</script>
</body>
</html>
